import Obj3D from '../Poly2/Obj3D.js';
import Geo from '../Poly2/Geo.js';
import Mat from '../Poly2/Mat.js';

const defAttr = () => ({
    pointSize: 50,
    margin: 0.5,//圆弧的半径比例

    color: [0.30, 0.53, 1, 0.5],
    program: '',
});

//圆弧
export default class Round {
    constructor(attr) {
        Object.assign(this, defAttr(), attr);
    }

    getElement(point) {
        return this._createRound({
            a_Position: point,
            color: this.color,
            pointSize: this.pointSize,
            margin: this.margin,
        });
    }

    _createRound(config) {
        const { a_Position, color, pointSize, margin } = config;
        const { program } = this;
        return new Obj3D({
            depthTest: false,
            geo: new Geo({
                data: {
                    'a_Position': { size: 2, array: new Float32Array([a_Position.x, a_Position.y]) },
                },
            }),
            mat: new Mat({
                program: program,
                mode: ['POINTS'],
                data: {
                    'u_PointSize': { type: 'uniform1f', value: pointSize },
                    'u_Set': { type: 'uniform1f', value: 0 },
                    'u_Color': { type: 'uniform4fv', value: color },
                    'u_Margin': { type: 'uniform1f', value: margin },
                },
            }),
        });
    }
}